<template>
  <view class="wrapper">
    <view class="card u-padding-30 bg-fff u-m-l-30 u-m-r-30">
      <view class="color-333 font-28">高考省份：
        <text class="color-666">{{form.provinceName}}</text>
      </view>
      <view class="color-333 font-28 u-m-t-10 u-m-b-10 row">院校名称：
        <navigator :url="`/pages/explore/school_info?id=${detail.id}`" class="color-active">{{detail.schoolName}}</navigator>
      </view>
      <view class="color-333 font-28 row">专业名称：
        <navigator class="color-active" :url="`/pages/explore/zhuanye_detail?code=${specialtyCode}`">{{form.specialtyName}}</navigator>
      </view>
    </view>
    <view class="card u-padding-30 bg-fff u-margin-30"  v-if="canvas">
      <uCharts :scroll="arr.opts.enableScroll"
               :show="canvas"
               canvasId="c0"
               :chartType="arr.chartType"
               :extraType="arr.extraType"
               :cWidth="cWidth"
               :cHeight="cHeight"
               :opts="arr.opts"
               ref="c0"/>
    </view>
    <view class="card u-padding-30 bg-fff u-m-t-30 u-m-l-30 u-m-r-30"  v-if="canvas">
      <uCharts :scroll="arr.opts2.enableScroll"
               :show="canvas"
               canvasId="c1"
               :chartType="arr.chartType"
               :extraType="arr.extraType"
               :cWidth="cWidth"
               :cHeight="cHeight"
               :opts="arr.opts2"
               ref="c1"/>
    </view>
  </view>
</template>

<script>
import uCharts from '../../components/leiqch-ucharts/u-charts.vue';
import {getCurrentFullPath} from "../../util/util";
export default {
  components: {uCharts},

  onLoad(option) {
    this.form = JSON.parse(option.data)
    this.detail = JSON.parse(option.render)
    this.specialtyCode = option.c
    this.init()
  },

  data() {
    return {
      form: {},
      detail: {},
      canvas: false,
      cWidth: '',
      cHeight: '',
      arr: {},
      specialtyCode: ''
    }
  },

  methods: {
    init() {
      this.cWidth = uni.upx2px(650);
      this.cHeight = uni.upx2px(450);
      let {year1, lowestOrder1, year2, year3, year4, lowestOrder2, lowestOrder3, lowestOrder4,
        lowestScore1, lowestScore2, lowestScore3, lowestScore4, forecastYear, lowestForecast
      } = this.detail
      var categories = [year1, year2, year3, year4, forecastYear]
      var categories2 = [year1, year2, year3, year4]
      var data = [{data: [lowestOrder1, lowestOrder2, lowestOrder3, lowestOrder4, lowestForecast], name: '历年录取位次与预估位次（最低分位次）'}]
      var data2 = [{data: [lowestScore1, lowestScore2, lowestScore3, lowestScore4], name: '历年录取分数（最低分）'}]
      var serverData = {
        opts: {
          categories: categories,
          enableScroll: false,
          series: data
        },
        opts2: {
          categories: categories2,
          enableScroll: false,
          series: data2
        },
        chartType: "line",
        extraType: "default"
      }
      this.arr = serverData
      this.canvas = true
    }
  },

  onShareAppMessage(res) {
    return {
      path: getCurrentFullPath()
    }
  }
}
</script>

<style scoped lang="scss">
  .wrapper {
    background: #F2F3F2;
    min-height: 100%;
    padding-top: 30upx;
    padding-bottom: 30upx;
    .card {
      border-radius: 8upx;
    }
  }
</style>
